<template>
  <div class="app-container">
    <el-form :model="form" ref="formRef" v-loading="formLoading" :scroll-to-error="true" :rules="rules">
      <el-space direction="vertical">
        <div shadow="never" class="assess">
          <el-row justify="center" class="task-title assess-title">
            <el-form-item label="评估记录编号：" prop="code">
              <span>{{ form.code }}</span>
            </el-form-item>
            <el-form-item label="评估记录名称：" prop="name">
              <span>{{ form.name }}</span>
            </el-form-item>
          </el-row>
          <el-row justify="center" class="assess-title">
            <el-form-item label="评估对象：" prop="evaluationObject">
              {{ form.evaluationObject }}
            </el-form-item>
            <el-form-item label="地震输入方式：" prop="inputMethod">
              <span>{{ inputMethods.find(item => item.value == form.inputMethod)?.name }}</span>
            </el-form-item>
          </el-row>
          <el-row v-if="curEvaluation">
            <el-form-item :label="sourceData[type].name" style="display:block;width: 100%;" prop="dataSource">
              <el-col :span="24">
                <el-row :gutters="20">
                  <el-checkbox-group v-model="form.dataSource" @change="dataSourceChange">
                    <el-checkbox v-for="item in sourceData[type].checkboxData" :key="item.name" :label="item.value">
                      <el-row align="middle" style="padding: 0">
                        <span>{{ item.name }}</span>
                        <el-space @click.prevent="" style="width: auto;padding: 0 10px;">
                          <el-input v-model="form['dataSourceId' + item.value]" placeholder="数据版本信息" style="width: 240px"
                            :disabled="!form.dataSource?.includes(item.value)" readonly
                            v-if="!form['dataSourceId' + item.value]"></el-input>
                          <div v-else>
                            <el-tag type="info" v-for="(item) in form['dataSourceId' + item.value].split(',')"
                              style="margin: 0 5px;" :key="item.value">{{ item }}</el-tag>
                          </div>
                          <el-button plain :disabled="!form.dataSource?.includes(item.value)"
                            @click="chooseDataSource(item.value)">选择数据版本</el-button>
                        </el-space>
                      </el-row>
                    </el-checkbox>
                  </el-checkbox-group>
                </el-row>
              </el-col>
            </el-form-item>
          </el-row>
        </div>
      </el-space>
      <template v-if="curEvaluation">
        <el-row style="margin: 10px 0;display: block;" justify="end">
          <!-- <el-button @click="" plain>网络拓扑图校验</el-button> -->
          <el-button @click="damageLevel" plain>破坏等级分析</el-button>
          <!-- <el-button @click="damageLevel" plain>功能失效分析</el-button> -->
          <el-button v-show="props.type != 'traffic' && props.type != 'communication'" @click="openNetworkDialog" plain style="float:right;">导入网络拓扑数据</el-button>
        </el-row>
        <el-space direction="vertical">
          <div shadow="never" class="assess">
            <el-row>
              <div style="position: absolute;right: 10px;bottom: 10px;z-index: 10;">
                <el-button type="primary" @click="openTable">破坏等级分析列表</el-button>
                <el-button type="primary" @click="openLayersNew">破坏等级分析图</el-button>
                <el-button type="primary" @click="openLayersNew1">功能失效分析图</el-button>
              </div>
              <el-form-item label="地震输入方式" style="display:block;width: 100%;" prop="seismicInput">
                <el-row>
                  <el-radio-group v-model="form.seismicInput" @change="modeChange">
                    <el-radio v-for="item in curInputMethod" :key="item.value" :label="item.value">
                      {{ item.name }}
                      <el-select v-model="form.seismicInputValue" v-if="item.value == 1" @change="seismicInputValueChange">
                        <el-option v-for="item in intensity" :key="item.dictItemId" :label="item.dictItemName"
                          :value="item.dictItemCode" />
                      </el-select>
                    </el-radio>
                  </el-radio-group>
                </el-row>
              </el-form-item>
            </el-row>
          </div>
        </el-space>
        <!-- <el-row v-if="activeTabsData[activeTab]?.length > 0" style="margin: 10px 0;" justify="end">
          <el-button type="primary" @click="openTable">破坏等级分析列表</el-button>
          <el-button type="primary" @click="openLayersNew">破坏等级分析图</el-button> -->
        <!--<el-button v-if="URL[type] == 'waterSupplySystem' || URL[type] == 'airSupply'
            || URL[type] == 'traffic'" type="primary">功能失效分析图</el-button>-->
        <!-- <el-button type="primary" @click="openLayersNew1">功能失效分析图</el-button>
        </el-row> -->
        <el-tabs v-if="isTableOrMap" v-model="activeTab" type="card" @tab-change="sourceDataTabChange">
          <el-tab-pane v-for="item in sourceData[type].checkboxData" :label="item.name" :name="item.value"></el-tab-pane>
          <el-row style="margin: 10px 0" v-if="activeTabsData[activeTab]?.length > 0">
            <el-button type="primary" @click="downloadShp">导出shp文件</el-button>
            <el-button type="primary" @click="downloadExcel">导出excel文件</el-button>
          </el-row>
          <el-table :data="activeTabsData[activeTab]" v-loading="loading" stripe :height="height">
            <slot :activeTab="activeTab" :seismicInput="form.seismicInput" :seismicInputValue="form.seismicInputValue">
            </slot>
          </el-table>
        </el-tabs>
      </template>
      <Empty v-else :description="`当前任务无【{{ route.meta.title }}】评估对象`" />
    </el-form>
    <!-- 选择数据源 -->
    <DataSource v-model:open="dataSourceOpen" :selected="form['dataSourceId' + dataSourceType]"
      :rang="form['dataSourceRang' + dataSourceType]" @getVersionCode="getVersionCode" :url="URL[type]"
      :type="dataSourceType" />
    <div v-if="!isTableOrMap" style="position:relative">
      <indexMap v-if="openMap" :paramsSql="paramsSql" :closeImgcreate="plotDialog" @showImgcreate="showImgcreate"
        @getLegendHtml="getLegendHtml" />
      <!--图层图例-->
      <div v-if="showHideLegendDivBool" class="layerMap-legend">
        <!--滚动条-->
        <el-scrollbar max-height="500px">
          <p>图例</p>
          <!--<div v-if="legendInfoHtml && legendInfoHtml!==''" v-html="legendInfoHtml"></div>-->
          <div v-for="item in layerShowHideArray" :key="item.code" v-show="item.show" v-html="item.legendHtml">
          </div>
        </el-scrollbar>
      </div>
    </div>
    <drawingView :open="plotDialog" :formParams="formParams" :title="title" @closeDialog="closeDialog" />
    <!--导入网络拓扑数据-->
    <NetworkDataset v-if="networkDialog" :networkParams="networkParams" :networkTitle="networkTitle"
      @closeDialog="networkDialog = false" @completeCount="getCurrentTaskData" />
  </div>
</template>

<script setup>
import { getCurrentTask, damageLevelAnalysis,getSmxEvaluationResultExtentLonLatList } from '@/api/lifelineProject/currentTask'
import { inputMethods, sourceData, URL } from '@/views/lifelineProject/index'
import indexMap from '@/map/lifelineProject/indexMap.vue'
import drawingView from '@/map/components/drawingView/index.vue';
import DataSource from '@/views/lifelineProject/components/dataSource.vue'
import NetworkDataset from '@/views/lifelineProject/components/networkdataset/index.vue';
import { getDict } from '@/api/system/dict.js'
/*import { watch } from 'vue';

const { map,dataTypeInfoArray,layerInfoParams,legendInfoArray,customStylesObj,dataListGeom } = toRefs(props);*/

const { proxy } = getCurrentInstance()
const props = defineProps({
  type: String,

  /*legendInfoHtml: {//图例信息html
    default: "",
    type: String,
  },*/
})
const route = useRoute()
const form = ref({
  dataSource: [],
  seismicInput: 1
})
const formMap = ref({ mapTemplateAttachId: '', title: '', unit: '' })
const openMap = ref(false)
const isTableOrMap = ref(true)
const plotDialog = ref(false)
const title = ref('')
const formParams = ref({})
const networkDialog = ref(false)
const networkTitle = ref('网络拓扑数据')
const networkParams = ref({})
const checkDataId = (rule, value, cb) => {
  if (value.length == 0) {
    cb(new Error(`请选择数据源！`))
  } else {
    // let checkedValue = value.map(item => form.value['dataSourceId' + item]).filter(item => item)
    // let checkedName = value.filter(item => !form.value['dataSourceId' + item]).map(item => sourceData[props.type].checkboxData.find(cur => cur.value == item)?.name)
    let checkedValue = sourceData[props.type].checkboxData.filter(item => form.value.dataSource.includes(item.value)).map(item => form.value['dataSourceId' + item.value]).filter(item => item)
    let checkedData = sourceData[props.type].checkboxData.filter(item => form.value.dataSource.includes(item.value))
    let checkedName = checkedData.map(item => item.name)

    if (checkedName.length != checkedValue.length) {
      let checkedNoValue = checkedData.filter(item => !form.value['dataSourceId' + item.value]).map(item => item.name)
      cb(new Error(`请选择【${checkedNoValue.join('、')}】数据版本！`))
    }
    cb()
  }
}
const rules = {
  dataSource: [{ validator: checkDataId, trigger: 'change' }]
}
const curInputMethod = computed(() => inputMethods.filter(item => item.value == form.value.inputMethod))
const curEvaluation = computed(() => form.value.evaluationObject?.split('、').some(item => item == route.meta.title))
// const curEvaluation = ref(true)
const formLoading = ref(false)
// 选择数据版本
const dataSourceChange = val => {
  sourceData[props.type].checkboxData.map(item => {
    if (!val.includes(item.value)) {
      form.value['dataSourceId' + item.value] = ''
    }
  })
}
const dataSourceOpen = ref(false)
const dataSourceType = ref()
const chooseDataSource = (type) => {
  dataSourceOpen.value = true
  dataSourceType.value = type
}
const getVersionCode = (id, rang, code) => {
  form.value['dataSourceId' + dataSourceType.value] = id
  form.value['dataSourceRang' + dataSourceType.value] = rang
  form.value['dataSourceCode' + dataSourceType.value] = code
  proxy.$refs['formRef'].validateField('dataSource')
}
// 破坏等级分析、功能失效分析
const loading = ref(false)
const damageLevel = () => {
  openMap.value = false
  isTableOrMap.value = true
  proxy.$refs['formRef'].validate(valid => {
    if (valid) {
      loading.value = true
      /*let data = form.value.dataSource.map(item => ({
        type: item,
        versionId: form.value['dataSourceId' + item],
        rang: form.value['dataSourceRang' + item]
      }))*/
      //只进行当前页面所选系统的破坏等级分析
      let data = [];
      let arr = sourceData[props.type].checkboxData;
      for (let i = 0; i < arr.length; i++) {
        let item = arr[i].value;
        let dataSourceId = form.value['dataSourceId' + item];
        if (dataSourceId) {
          let obj = {
            type: item,
            versionId: dataSourceId,
            rang: form.value['dataSourceRang' + item],
            versionCode: form.value['dataSourceCode' + item],
          }
          data.push(obj);
        }
      }
      //破坏等级分析
      damageLevelAnalysis(data).then(res => {
        activeTabsData.value = res.data
        loading.value = false
        openTable();
      }).catch(() => loading.value = false)
    }
  })
}
// 烈度
const intensity = ref([])
const getDictData = (field) => {
  getDict('ld').then(res => {
    intensity.value = res.data
    form.value[field] = res.data[0].dictItemCode
  })
}
// 切换地震输入方式
const modeChange = (val) => {
  form.value.seismicInputValue = ''
  if (val == 1) {
    form.value.seismicInputValue = intensity.value[0].dictItemCode
  }
  //切换地震烈度
  seismicIntValueChange();
}
//切换地震烈度
const seismicInputValueChange = (val) => {
  if(paramsSql.value.layerType == "破坏等级分析列表"){
    //破坏等级分析列表
    openTable();
  }else if(paramsSql.value.layerType == "破坏等级分析图"){
    //破坏等级分析图
    openLayersNew();
  }else if(paramsSql.value.layerType == "功能失效分析图"){
    //功能失效分析图
    openLayersNew1();
  }
}

//根据sql导出shp文件并下载zip
function downloadShpFileBySql(name, dataset, sqlFilter) {
  //下载文件
  let fileName = name + ".zip";
  proxy.download("/hypergraph/downloadShpFileBySql", { dataset, sqlFilter }, fileName);
}
//导出shp文件--根据sql导出shp文件并下载zip
const downloadShp = () => {
  let type = activeTab.value;
  let taskId = form.value.id;
  let sqlFilter = "task_id='" + taskId + "' and del_flag='0' and type=" + type;//过滤条件
  // let fileName = selectVersionName1+"版本"+selectVersion1;
  let resultLength = activeTabsData.value[type] ? activeTabsData.value[type].length : 0;
  if (resultLength > 0) {
    let dataSourceId = activeTabsData.value[type][0].dataSourceId;
    let tempName = "_版本" + dataSourceId + "_破坏等级分析";
    if (props.type == 'waterSupply') {
      if (type == 1) {
        downloadShpFileBySql("地下管网" + tempName, "fxqh_smx_evaluation_results_line", sqlFilter);//线数据
      } else if (type == 11) {
        downloadShpFileBySql("水厂泵房" + tempName, "fxqh_smx_evaluation_results", sqlFilter);
      } else if (type == 2) {
        downloadShpFileBySql("水厂水池" + tempName, "fxqh_smx_evaluation_results", sqlFilter);
      }
    } else if (props.type == 'gasSupply') {
      if (type == 3) {
        downloadShpFileBySql("燃气-储气罐" + tempName, "fxqh_smx_evaluation_results", sqlFilter);
      } else if (type == 14) {
        downloadShpFileBySql("燃气-门站/场站" + tempName, "fxqh_smx_evaluation_results", sqlFilter);
      } else if (type == 15) {
        downloadShpFileBySql("供气管网" + tempName, "fxqh_smx_evaluation_results_line", sqlFilter);//线数据
      }
    } else if (props.type == 'powerSupply') {
      if (type == 6) {
        downloadShpFileBySql("变电站" + tempName, "fxqh_smx_evaluation_results", sqlFilter);
      } else if (type == 8) {
        downloadShpFileBySql("电缆线路" + tempName, "fxqh_smx_evaluation_results_line", sqlFilter);//线数据
      } else if (type == 12) {
        downloadShpFileBySql("重要发电厂房" + tempName, "fxqh_smx_evaluation_results", sqlFilter);
      }
    } else if (props.type == 'traffic') {
      if (type == 5) {
        downloadShpFileBySql("道路" + tempName, "fxqh_smx_evaluation_results_line", sqlFilter);//线数据
      } else if (type == 4) {
        downloadShpFileBySql("桥梁" + tempName, "fxqh_smx_evaluation_results", sqlFilter);
      }
    } else if (props.type == 'communication') {
      if (type == 13) {
        downloadShpFileBySql("通信基站" + tempName, "fxqh_smx_evaluation_results", sqlFilter);
      } else if (type == 9) {
        downloadShpFileBySql("通信室内设备" + tempName, "fxqh_smx_evaluation_results", sqlFilter);
      }
    }
  }
}

// 导出shp文件--（导出报错废弃此方法）
/*const downloadShp = () => {
  proxy.hrefDownload({
    url: '/estimate/exportShp',
    params: {
      type: activeTab.value,
      taskId: form.value.id
    },
    text: '正在导出shp文件...'
  })
}*/
// 导出excel文件
const downloadExcel = () => {
  proxy.hrefDownload({
    url: '/estimate/exportExcel',
    params: {
      type: activeTab.value,
      taskId: form.value.id
    },
    text: '正在导出excel文件...'
  })
}

const activeTab = ref('')
const activeTabsData = ref({})
const sourceDataTabChange = val => {
  openMap.value = false
  isTableOrMap.value = true
}
const height = computed(() => {
  return activeTabsData.value[activeTab.value] ? (activeTabsData.value[activeTab.value].length > 10 ? 496 : activeTabsData.value[activeTab.value]?.length * 45 + 46) : 106
})
const getCurrentTaskData = () => {
  formLoading.value = true
  getCurrentTask().then(res => {
    formLoading.value = false
    form.value = { ...form.value, ...res.data }
    form.value.seismicInput = res.data.inputMethod
    if (!res.data.sourceData) form.value.dataSource = []
    if (form.value.seismicInput == '1') {
      getDictData('seismicInputValue')
    }
    form.value.list.map(item => {
      form.value['dataSourceId' + item.type] = item.dataSourceId
      form.value['dataSourceRang' + item.type] = item.rang
      form.value['dataSourceCode' + item.type] = item.versionCode
      if (!form.value.dataSource.includes(item.type)) {
        form.value.dataSource.push(item.type)
      }
      if (Array.isArray(activeTabsData.value[item.type])) {
        activeTabsData.value[item.type].push(item)
      } else {
        activeTabsData.value[item.type] = [item]
      }
    })
    //查询生命线分析点、线数据的范围经纬度列表
    console.log(form.value);
    getSmxEvaluationResultExtent();
  }).catch(() => formLoading.value = false)
  activeTab.value = sourceData[props.type].checkboxData[0].value
  openTable()
}
onMounted(() => {
  //查询数据
  getCurrentTaskData()
})

const extentLonLatList = ref([]);
//查询生命线分析点、线数据的范围经纬度列表
function getSmxEvaluationResultExtent(){
  getSmxEvaluationResultExtentLonLatList({taskId:form.value.id,qcType:props.type}).then(res => {
    extentLonLatList.value = res.data ? res.data : [];
  });
}

function openTable() {
  // isTableOrMap.value = true
  openMap.value = false
  isTableOrMap.value = true
  let seismicInputMode = "1";//地震输入方式0为设定烈度,1为地震影响场
  if (form.value.seismicInput == 1) {
    seismicInputMode = "0"
  }
  let params = {
    taskId: form.value.id,
    intensity: form.value.seismicInputValue,
    type: sourceData[props.type],
    seismicInputMode: seismicInputMode,
    layerType: "破坏等级分析列表"
  }
  paramsSql.value = params
}
const paramsSql = ref({})
//破坏等级分析图
function openLayersNew() {
  openMap.value = false;
  layerShowHideArray.value = [];
  nextTick(() => {
    openLayers();
  })
}
function openLayers() {
  openMap.value = true
  isTableOrMap.value = false
  let seismicInputMode = "1";//地震输入方式0为设定烈度,1为地震影响场
  if (form.value.seismicInput == 1) {
    seismicInputMode = "0"
  }
  let params = {
    taskId: form.value.id,
    intensity: form.value.seismicInputValue,
    type: sourceData[props.type],
    seismicInputMode: seismicInputMode,
    layerType: "破坏等级分析图",
    extentLonLatList:extentLonLatList.value
  }
  paramsSql.value = params
}
//功能失效分析图
function openLayersNew1() {
  openMap.value = false;
  layerShowHideArray.value = [];
  nextTick(() => {
    openLayers1();
  })
}
function openLayers1() {
  openMap.value = true
  isTableOrMap.value = false
  let seismicInputMode = "1";//地震输入方式0为设定烈度,1为地震影响场
  if (form.value.seismicInput == 1) {
    seismicInputMode = "0"
  }
  let params = {
    taskId: form.value.id,
    intensity: form.value.seismicInputValue,
    type: sourceData[props.type],
    seismicInputMode: seismicInputMode,
    layerType: "功能失效分析图",
    extentLonLatList:extentLonLatList.value
  }
  paramsSql.value = params
}
const layerShowHideArray = ref([])
const showHideLegendDivBool = ref(false)

/*const clearAllLayersBool = ref(false);//清除全部图层
const showAllLayersBool = ref(false);//显示全部图层
const historyLayerSelectData = ref([])

const layerSelectData = ref([]);//图层选择内容
const selectLayerNameArray = ref([])

//图层数据类型数组
watch(() => props.dataTypeInfoArray, val => {
  if (val) {
    let array = [];
    let showHideArray = [];
    val.forEach((item,index)=>{
      array.push({ value: item.name, label: item.name });
      showHideArray.push({ code: item.code, name: item.name, show:false,legendHtml:"" });
    });
    layerOptions.value = array;
    layerShowHideArray.value = showHideArray;
  }
}, { deep: true, immediate: true });

//图层查询参数
watch(() => props.layerInfoParams, val => {
  if (val) {
    layerDataQueryParams.value = val;
    let selectLayerNameArray = [];//勾选的图层名称数组
    if(val.showAllLayers){//勾选显示全部图层
      let array = props.dataTypeInfoArray;
      if(array && array.length>0){
        for(let i=0;i<array.length;i++){
          let name = array[i].name;
          layerSelectData.value.push([name]);
          selectLayerNameArray.push([name]);
          if(showHideLayerDivBool.value==true){//显示图层选择控件，刷新显示
            showHideLayerDivBool.value = false;//先隐藏
            setTimeout(function(){
              showHideLayerDivBool.value = true;//再显示，可刷新
            },100);
          }
        }
        //显示全部图层
        showAllLayersBool.value = true;
        //图层显示隐藏数组
        let showHideArray = layerShowHideArray.value;
        for(let i=0;i<showHideArray.length;i++){
          showHideArray[i].show = true;//显示
        }
        showHideLegendDivBool.value = true;//显示图例
      }
    }else{//勾选显示1个图层
      let a = layerSelectData.value.find(item => item == val.name)
      if(a == undefined) {
        layerSelectData.value.push([val.name]);
      }
      selectLayerNameArray.push([val.name]);
      if(showHideLayerDivBool.value==true){//显示图层选择控件，刷新显示
        showHideLayerDivBool.value = false;//先隐藏
        setTimeout(function(){
          showHideLayerDivBool.value = true;//再显示，可刷新
        },100);
      }
      //图层显示隐藏数组
      let showHideArray = layerShowHideArray.value;
      for(let i=0;i<showHideArray.length;i++){
        if(showHideArray[i].name==val.name){
          showHideArray[i].show = true;//显示
          showHideLegendDivBool.value = true;//显示图例
          break;
        }
      }
    }
    emits("getLayerSelectData",selectLayerNameArray);
  }
}, { deep: true, immediate: true });

watch(() => props.openAddLayer, val => {
  if(val){
    // 图层显示隐藏数组
    let showHideArray = layerShowHideArray.value;
    for(let i=0;i<showHideArray.length;i++){
      if(selectLayerNameArray.value.indexOf(showHideArray[i].name)==-1){//未勾选
        if(showHideArray[i].show==true){
          showHideArray[i].show = false;//隐藏
          layerDataQueryParams.value = {//查询图层信息参数（图层序号、图层名称、查询条件、是否显示）
            code:showHideArray[i].code,
            name:showHideArray[i].name,
            sqlText:'',
            show:false
          };
          break;
        }
      }else{//已勾选
        if(showHideArray[i].show==false){
          showHideArray[i].show = true;//显示
          showHideLegendDivBool.value = true;//显示图例
          layerDataQueryParams.value = {//查询图层信息参数（图层序号、图层名称、查询条件、是否显示）
            code:showHideArray[i].code,
            name:showHideArray[i].name,
            sqlText:'',
            show:true
          };
          break;
        }
      }
    }
  }
}, { deep: true, immediate: true })

watch(() => props.deleteSelectData, val => {
  if(val){
    nextTick(() =>{
      layerSelectData.value.splice(layerSelectData.value.length - 1, 1);
      let data = proxy.$refs.cascader.$refs.panel.checkedNodes
      data[data.length - 1].checked = false;
      data.splice(data.length - 1,1)
      // 刷新输入框选择显示，删除过后数据显示会异常
      console.log(proxy.$refs.cascader.$refs.panel.calculateCheckedValue())
      historyLayerSelectData.value = layerSelectData.value
    })
  }
}, { deep: true, immediate: true })
const allDataListGeom = ref([])
watch(() => props.dataListGeom, val => {
  if(val&&val.length != 0) {
    allDataListGeom.value = props.dataListGeom
    let a = layerSelectData.value.find(item => item == '重大工程历史震害')
    if(a == undefined) {
      layerSelectData.value.push(['重大工程历史震害']);
    }
  }
}, { deep: true, immediate: true })
dataListGeom
//显示隐藏图层选择面板
function showHideLayerDiv(){
  if(showHideLayerDivBool.value){
    showHideLayerDivBool.value = false;
  }else{
    showHideLayerDivBool.value = true;
  }
}*/


//图例
const getLegendHtml = (obj) => {
  if (obj != null) {
    /*layerShowHideArray.value = [{
      name: obj.name,
      show: obj.show,
      legendHtml: obj.legendHtml
    }];*/
    layerShowHideArray.value.push({
      name: obj.name,
      show: obj.show,
      legendHtml: obj.legendHtml
    });
    showHideLegendDivBool.value = true;// 打开图例面板

    /*let showHideArray = layerShowHideArray.value;
    for(let i=0;i<showHideArray.length;i++){
      if(showHideArray[i].name==obj.name){
        showHideArray[i].legendHtml = obj.legendHtml;//显示图例
        break;
      }
    }*/

  } else {
    layerShowHideArray.value = [];
  }
}
const closeDialog = (bool) => {
  plotDialog.value = false;
}
const showImgcreate = (bool) => {
  if (bool == false) {
    return;
  }
  plotDialog.value = true
  formParams.value.taskId = form.value.id
  formParams.value.dataType = '2'
  let tempTitle = paramsSql.value.layerType;
  if (paramsSql.value.layerType == "破坏等级分析图") {
    formParams.value.dataType = '2'
  } else if (paramsSql.value.layerType == "功能失效分析图") {
    formParams.value.dataType = '3'
  }
  // formParams.value.seismicInputMode = form.value.seismicInputMode
  // formParams.value.condition = form.value.condition
  let seismicInputMode = "1";//地震输入方式0为设定烈度,1为地震影响场
  if (form.value.seismicInput == 1) {
    seismicInputMode = "0"
  }
  formParams.value.seismicInputMode = seismicInputMode;
  formParams.value.condition = form.value.seismicInputValue;
  if (props.type == 'waterSupply') {
    title.value = '生命线-供水系统评估-' + tempTitle
    formParams.value.assessObj = '0'
  } else if (props.type == 'gasSupply') {
    title.value = '生命线-供气系统评估-' + tempTitle
    formParams.value.assessObj = '1'
  } else if (props.type == 'powerSupply') {
    title.value = '生命线-供电系统评估-' + tempTitle
    formParams.value.assessObj = '2'
  } else if (props.type == 'traffic') {
    title.value = '生命线-交通系统评估-' + tempTitle
    formParams.value.assessObj = '3'
  } else if (props.type == 'communication') {
    title.value = '生命线-通信系统评估-' + tempTitle
    formParams.value.assessObj = '4'
  }
}

//显示导入网络拓扑数据弹窗
function openNetworkDialog() {
  networkParams.value.taskId = form.value.id;
  networkParams.value.selectVersion1 = '';
  networkParams.value.selectVersion2 = '';
  networkParams.value.selectVersion3 = '';
  networkParams.value.selectVersionName1 = '';
  networkParams.value.selectVersionName2 = '';
  networkParams.value.selectVersionName3 = '';
  networkParams.value.selectVersionType1 = '';
  networkParams.value.selectVersionType2 = '';
  networkParams.value.selectVersionType3 = '';
  let lineBool = false;//是否有线数据
  let sourceBool = false;//是否有源点
  console.log("显示导入网络拓扑数据弹窗--"+props.type);
  console.log(sourceData[props.type].checkboxData);
  console.log(activeTabsData.value);
  console.log(form.value);
  if (props.type == 'waterSupply') {
    networkTitle.value = '生命线-供水系统评估-网络拓扑数据'
    networkParams.value.dataType = '供水系统'
    let arr = sourceData[props.type].checkboxData;
    for (let i = 0; i < arr.length; i++) {
      let name = arr[i].name;
      let type = arr[i].value;
      let resultLength = activeTabsData.value[type] ? activeTabsData.value[type].length : 0;
      let dataSourceId = form.value['dataSourceId' + type];
      if (dataSourceId) {
        let bool = false;//是否所选数据源已有破坏等级分析计算结果
        if (resultLength > 0) {
          bool = true;
        }
        if (name == "地下管网") {
          networkParams.value.selectVersion1 = dataSourceId;
          networkParams.value.selectVersionName1 = name;
          networkParams.value.selectVersionType1 = type;
          lineBool = bool;
        } else if (name == "水厂泵房") {
          networkParams.value.selectVersion2 = dataSourceId;
          networkParams.value.selectVersionName2 = name;
          networkParams.value.selectVersionType2 = type;
          sourceBool = bool;
        } else if (name == "水厂水池") {
          networkParams.value.selectVersion3 = dataSourceId;
          networkParams.value.selectVersionName3 = name;
          networkParams.value.selectVersionType3 = type;
        }
      }
    }
  } else if (props.type == 'gasSupply') {
    networkTitle.value = '生命线-供气系统评估-网络拓扑数据'
    networkParams.value.dataType = '供气系统'
    let arr = sourceData[props.type].checkboxData;
    for (let i = 0; i < arr.length; i++) {
      let name = arr[i].name;
      let type = arr[i].value;
      let resultLength = activeTabsData.value[type] ? activeTabsData.value[type].length : 0;
      let dataSourceId = form.value['dataSourceId' + type];
      if (dataSourceId) {
        let bool = false;//是否所选数据源已有破坏等级分析计算结果
        if (resultLength > 0) {
          bool = true;
        }
        if (name == "供气管网") {
          networkParams.value.selectVersion1 = dataSourceId;
          networkParams.value.selectVersionName1 = name;
          networkParams.value.selectVersionType1 = type;
          lineBool = bool;
        } else if (name == "燃气-储气罐") {
          networkParams.value.selectVersion2 = dataSourceId;
          networkParams.value.selectVersionName2 = name;
          networkParams.value.selectVersionType2 = type;
          sourceBool = bool;
        } else if (name == "燃气-门站/场站") {
          networkParams.value.selectVersion3 = dataSourceId;
          networkParams.value.selectVersionName3 = name;
          networkParams.value.selectVersionType3 = type;
        }
      }
    }
  } else if (props.type == 'powerSupply') {
    networkTitle.value = '生命线-供电系统评估-网络拓扑数据'
    networkParams.value.dataType = '供电系统'
    let arr = sourceData[props.type].checkboxData;
    for (let i = 0; i < arr.length; i++) {
      let name = arr[i].name;
      let type = arr[i].value;
      let resultLength = activeTabsData.value[type] ? activeTabsData.value[type].length : 0;
      let dataSourceId = form.value['dataSourceId' + type];
      if (dataSourceId) {
        let bool = false;//是否所选数据源已有破坏等级分析计算结果
        if (resultLength > 0) {
          bool = true;
        }
        if (name == "电缆线路") {
          networkParams.value.selectVersion1 = dataSourceId;
          networkParams.value.selectVersionName1 = name;
          networkParams.value.selectVersionType1 = type;
          lineBool = bool;
        } else if (name == "变电站") {
          networkParams.value.selectVersion2 = dataSourceId;
          networkParams.value.selectVersionName2 = name;
          networkParams.value.selectVersionType2 = type;
          sourceBool = bool;
        } else if (name == "重要发电厂房") {
          networkParams.value.selectVersion3 = dataSourceId;
          networkParams.value.selectVersionName3 = name;
          networkParams.value.selectVersionType3 = type;
        }
      }
    }
  } else if (props.type == 'traffic') {
    networkTitle.value = '生命线-交通系统评估-网络拓扑数据'
    networkParams.value.dataType = '交通系统'
    let arr = sourceData[props.type].checkboxData;
    for (let i = 0; i < arr.length; i++) {
      let name = arr[i].name;
      let type = arr[i].value;
      let resultLength = activeTabsData.value[type] ? activeTabsData.value[type].length : 0;
      let dataSourceId = form.value['dataSourceId' + type];
      if (dataSourceId) {
        let bool = false;//是否所选数据源已有破坏等级分析计算结果
        if (resultLength > 0) {
          bool = true;
        }
        if (name == "道路") {
          networkParams.value.selectVersion1 = dataSourceId;
          networkParams.value.selectVersionName1 = name;
          networkParams.value.selectVersionType1 = type;
          lineBool = bool;
        } else if (name == "桥梁") {
          networkParams.value.selectVersion2 = dataSourceId;
          networkParams.value.selectVersionName2 = name;
          networkParams.value.selectVersionType2 = type;
          sourceBool = bool;
        }
      }
    }
  } else if (props.type == 'communication') {
    networkTitle.value = '生命线-通信系统评估-网络拓扑数据'
    networkParams.value.dataType = '通信系统'
    let arr = sourceData[props.type].checkboxData;
    for (let i = 0; i < arr.length; i++) {
      let name = arr[i].name;
      let type = arr[i].value;
      let resultLength = activeTabsData.value[type] ? activeTabsData.value[type].length : 0;
      let dataSourceId = form.value['dataSourceId' + type];
      if (dataSourceId) {
        let bool = false;//是否所选数据源已有破坏等级分析计算结果
        if (resultLength > 0) {
          bool = true;
        }
        if (name == "通信基站") {
          networkParams.value.selectVersion1 = dataSourceId;
          networkParams.value.selectVersionName1 = name;
          networkParams.value.selectVersionType1 = type;
        } else if (name == "通信室内设备") {
          networkParams.value.selectVersion2 = dataSourceId;
          networkParams.value.selectVersionName2 = name;
          networkParams.value.selectVersionType2 = type;
        }
      }
    }
  }
  console.log("lineBool:"+lineBool+",sourceBool:"+sourceBool);
  console.log(networkParams.value);
  if (lineBool && sourceBool) {
    networkDialog.value = true;
  } else {
    proxy.$modal.msgWarning("请先选择数据源进行破坏等级分析");
  }
}
</script>

<style lang="scss" scoped>
.assess-dialog.el-dialog .el-dialog__body {
  padding: 20px 20px;
}

.el-form-item.el-form-item--default {
  margin: 10px 0 20px;
}

.assess-title {
  .el-form-item.el-form-item--default {
    margin: 10px 20px
  }
}
</style>
<style lang="scss" scoped>
:deep(.el-space) {
  width: 100%;

  &>.el-space__item {
    width: 100%;
  }
}

.assess {
  border-radius: 4px;
  border: 1px solid #e4e7ed;

  .task-title {
    font-weight: bold;
    color: #606266;

    :deep(.el-form-item) {

      label,
      .el-form-item__content {
        font-size: 18px;
      }
    }
  }

  .border-bottom {
    border-bottom: 1px solid var(--el-border-color-light);
  }

  .el-row {
    padding: 0 20px;
  }

  .title {
    font-weight: bold;
  }

  :deep(.column.el-radio-group) {
    flex-direction: column;
    align-items: start;

    &>.el-radio {
      &>.el-radio__label {
        &>.el-space {
          &>.el-space__item:first-of-type {
            margin-right: 50px !important;
          }
        }
      }
    }
  }

  :deep(.el-checkbox-group) {
    .el-checkbox {
      margin: 10px 30px 10px 0;
    }
  }
}

//图例
.layerMap-legend {
  position: absolute;
  right: 10px;
  bottom: 10px;
  min-height: 50px;
  background: #fff;
  padding: 10px;
  overflow: auto;
  min-width: 200px;
  box-shadow: 0px 0px 20px rgba(0, 0, 0, 0.2);
  border: 1px solid #707070;
  border-radius: 4px;
}

.layerMap-legend p:first-child {
  text-align: center;
  font-weight: bold;
}
</style>